<!DOCTYPE html>
<html style="overflow-x:hidden; overflow-y:auto;">
<head>
    <meta charset="UTF-8">
    <title>英雄联盟新版本数据导入皮肤管理</title>
    <link rel="stylesheet" href="Public/Plug/layui/css/layui.css" media="all" />
    <style type="text/css">
        body{
            min-width: 1330px;
        }
        .layui-upload-choose{
            display: none;
        }

        .skin-div{
            padding: 9px 15px;
            min-height: 20px;
            line-height: 20px;
            font-size: 14px;
            margin-top: 10px;
            cursor: pointer;
        }

        .skin-div:hover{
            background-color: #1BA194;
            color: #fff;
        }

        .skin_title{

            font-size: 18px;
            font-weight: bold;
        }
        .title_pixel{
            display: inline-block;
            margin-left: 20px;
            color: red;
        }
        .blue{
            color: blue;
        }
        .hero-title{
            margin-top: 49px;
            font-size: 22px;
            font-weight: 700;
            margin-left: 20px;
        }
        .hero-box, .hero-box-2, .hero-box-3, .hero-box-row{
            display: flex;
        }
        .hero-box{
            margin-top: 20px;
        }
        .hero-box-2-left{
            margin: 0px 20px;
            border-top: 1px solid #eee;
            border-bottom: 1px solid #eee;
            padding: 20px 20px;
            box-shadow: 0px 0px 9px 0px #8A8A8A;
        }
        .hero-box-2-right .layui-col-md6:nth-child(1), .hero-box-3-right .layui-col-md6:nth-child(1){
            width: 500px !important;
        }
        .hero-box-2-right .layui-col-md6:nth-child(2), .hero-box-3-right .layui-col-md6:nth-child(2){
            margin-top: 30px;
        }
        .hero-box-3{
            width: 839px;
            margin: 20px 20px;
            border-top: 1px solid #eee;
            border-bottom: 1px solid #eee;
            padding: 20px 20px;
            box-shadow: 0px 0px 9px 0px #8A8A8A;
        }
        .hero-box-3-left{
            margin-right: 30px;
        }
        .hero-box-1{
            margin: 20px 20px;
            border-top: 1px solid #eee;
            border-bottom: 1px solid #eee;
            padding: 20px 20px;
            box-shadow: 0px 0px 9px 0px #8A8A8A;
        }
        .hero-box-1-left{
            margin-right: 30px;
        }
        .hero-box-1-right .layui-col-md6:nth-child(1){
            width: 300px !important;
        }
        .hero-box-1-right .layui-col-md6:nth-child(2){
            margin-top: 30px;
        }
        .mtop{
            margin-top: 20px;
        }
        .mleft{
            margin-left: 30px;
        }
        .hero-textarea{
            margin: 20px 20px;
        }
    </style>
</head>

<body>
<div class="admin-main">
    <div class="layui-row layui-col-space20">
        <div style="text-align: center;margin: 20px 10px 10px 20px;border-right: 1px solid #e6e6e6;max-height: 300px;overflow: hidden;" class="layui-col-md2">
            <span style="font-weight: bold;">A-G</span>
            <br/>
            <!-- 数据表格 -->
            <div style="overflow-y:scroll; overflow-x:scroll;height: 300px;" class="layui-row">
                {foreach $arrHeroNameOne as $val}
                <div onclick="changeData({$val.heroId})" class="layui-col-md4 skin-div {if $val.heroIsChange}blue{/if}">{$val.alias}</div>
                {/foreach}
            </div>
        </div>
        <div style="text-align: center;margin: 20px 10px 10px 20px;border-right: 1px solid #e6e6e6;max-height: 300px;overflow: hidden;" class="layui-col-md2">
            <span style="font-weight: bold;">H-M</span>
            <br/>
            <!-- 数据表格 -->
            <div style="overflow-y:scroll; overflow-x:scroll;height: 300px;" class="layui-row">
                {foreach $arrHeroNameTwo as $val}
                <div onclick="changeData({$val.heroId})" class="layui-col-md4 skin-div {if $val.heroIsChange}blue{/if}">{$val.alias}</div>
                {/foreach}
            </div>
        </div>
        <div style="text-align: center;margin: 20px 10px 10px 20px;border-right: 1px solid #e6e6e6;max-height: 300px;overflow: hidden;" class="layui-col-md2">
            <span style="font-weight: bold;">N-S</span>
            <br/>
            <!-- 数据表格 -->
            <div style="overflow-y:scroll; overflow-x:scroll;height: 300px;" class="layui-row">
                {foreach $arrHeroNameThree as $val}
                <div onclick="changeData({$val.heroId})" class="layui-col-md4 skin-div {if $val.heroIsChange}blue{/if}">{$val.alias}</div>
                {/foreach}
            </div>
        </div>
        <div style="text-align: center;margin: 20px 10px 10px 20px;border-right: 1px solid #e6e6e6;max-height: 300px;overflow: hidden;" class="layui-col-md2">
            <span style="font-weight: bold;">T-Z</span>
            <br/>
            <!-- 数据表格 -->
            <div style="overflow-y:scroll; overflow-x:scroll;height: 300px;" class="layui-row">
                {foreach $arrHeroNameFour as $val}
                <div onclick="changeData({$val.heroId})" class="layui-col-md4 skin-div {if $val.heroIsChange}blue{/if}">{$val.alias}</div>
                {/foreach}
            </div>
        </div>
        <div style="margin-top: 20px;" class="layui-col-md2">
            <input type="hidden" name="versionId" value="{$skinsBaseInfo.versionId}" />
            <input type="hidden" name="heroId" value="{$skinsBaseInfo.heroId}" />
            <input type="hidden" name="skinId" value="{$skinsBaseInfo.skinId}" />
            <input type="hidden" name="title" value="{$hero.title}" />
            <button style="margin-bottom: 10px" class="layui-btn checkIsUpdate">检测更新</button><br/>
            <a style="margin-bottom: 10px" href="{U('Skin/more')}" class="layui-btn">皮肤汇总</a><br/>
            <button style="margin-bottom: 10px;" class="layui-btn editSkin">保存</button><br/>
            <a style="margin-bottom: 10px" href="{U('Skin/preview')}" class="layui-btn">发布预览</a><br/>
        </div>
    </div>

    <div style="margin-top: 20px;border-top: 1px solid #e6e6e6;" class="layui-row">
        <div class="layui-col-md12">
            <div style="margin-top: 20px;" class="layui-row">
                <div class="layui-col-md12">
                    <span style="display: inline-block;font-weight: bold;font-size: 20px;margin-left: 40px;"><span>{$hero.title}</span>皮肤</span>
                </div>
            </div>
        </div>
    </div>
    <div class="layui-row">
        {foreach $skinsAllInfo as $key=>$val}
        <div style="margin-left: 30px;margin-top: 20px;" class="layui-col-md2 {if $val.isUpdate}blue{/if}">
            <div style="font-weight: bold;font-size: 16px;border: 1px solid #000;padding: 5px 10px;text-align: center;cursor: pointer;" onclick="changeSkin({$val.skinId})">{$val.name}</div>
        </div>
        {/foreach}
    </div>
    <div class="layui-row">
        <div style="margin-top: 20px;margin-left: 40px;" class="layui-col-md2">
            <div style="font-size: 16px;text-align: left;">ID&nbsp;&nbsp;&nbsp;{$skinsBaseInfo.skinId}</div>
        </div>
    </div>
    <div class="layui-row">
        <div style="margin-top: 20px;margin-left: 40px;width: 60px;line-height: 48px;" class="layui-col-md1">
            <div style="font-size: 14px;text-align: left;">名称 </div>
        </div>
        <div style="margin-top: 20px;" class="layui-col-md2">
            <div style="font-size: 14px;border: 1px solid #000;padding: 10px 0px;text-align: center;">{$skinsBaseInfo.name}</div>
        </div>
        <div style="margin-top: 20px;" class="layui-col-md2">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label {if $skinsBaseInfo.emblemsNameIsChange}blue{/if}">类型</label>
                    <div class="layui-input-block">

                        <select lay-verify="required">
                            {foreach $showTypes as $key=>$val}
                            <option
                                    {if $showType == $key} selected {/if}
                            value="{$key}">{$val}
                            </option>
                            {/foreach}
                        </select>

                    </div>
                </div>
            </form>
        </div>
        <div style="margin-top: 20px;width: 65px;margin-left: 34px;" class="layui-col-md2">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <div class="inp-check">
                        <input type="checkbox" name="close" lay-skin="switch" lay-text="收起|编辑">
                    </div>
                </div>
            </form>
        </div>
        <div style="margin-top: 20px;display: none;" class="layui-col-md2 sel-flag">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label {if $skinsBaseInfo.emblemsNameIsChange}blue{/if}" style="width: 31px;">类型</label>
                    <div class="layui-input-block" style="margin-left: 68px;">

                        <select id="skinType" name="skinType" lay-verify="required">
                            {foreach $skinsType as $key=>$val}
                            <option
                                    {if $skinsBaseInfo.emblemsName == $key} selected {/if}
                            {if $key == "base"} disabled {else} {/if}
                            value="{$key}">{$val}
                            </option>
                            {/foreach}
                        </select>

                    </div>
                </div>
            </form>
        </div>
        <div class="layui-col-md9">
            <div style="margin-top: 20px;" class="layui-row">
                <label class="layui-form-label {if $skinsBaseInfo.vedioPathIsChange}blue{/if}">视频地址</label>
                <div style="margin-left: 20px;" class="layui-col-md4">
                    <div>
                        <input type="text" name="vedioPath" required  lay-verify="required" placeholder="皮肤视频地址" autocomplete="off" class="layui-input skinVedioPath" value="{$skinsBaseInfo.vedioPath}">
                    </div>
                </div>
                <div class="layui-col-md5 mleft">
                    <button style="display: inline-block;" class="layui-btn layui-btn-xs layui-btn-normal showVideo">皮肤视频预览</button>
                </div>
            </div>
        </div>
        <div class="layui-col-md9">
            <div style="margin-top: 20px;" class="layui-row">
                <div class="layui-col-md4">
                    <label class="layui-form-label {if $skinsBaseInfo.publishTimeIsChange}blue{/if}">上架日期</label>
                    <div class="layui-inline">
                        <input type="text" class="layui-input publishTime" id="publishTime" value="{$skinsBaseInfo.publishTime}">
                    </div>
                </div>
                <div class="layui-col-md3">
                    <form class="layui-form" action="">
                        <div class="layui-form-item">
                            <label class="layui-form-label {if $skinsBaseInfo.suitTypeIsChange}blue{/if}" style="width: 60px;">套装属性</label>
                            <div class="layui-input-block">
                                <select id="suitType" name="suitType" lay-verify="required">
                                    <option value="">--请选择--</option>
                                    {foreach $suitOptions[0] as $key=>$val}
                                    <option value="{$key}"
                                            {if $skinsBaseInfo.suitType == $val} selected {/if}
                                    >{$val}</option>
                                    {/foreach}
                                </select>
                            </div>
                        </div>
                    </form>
                </div>
                <div style="width: 65px;margin-left: 34px;" class="layui-col-md2">
                    <form style="width: 55px;" class="layui-form" action="">
                        <div class="layui-form-item">
                            <div class="inp-check-text">
                                <input type="checkbox" name="close" lay-skin="switch" lay-text="选择|添加">
                            </div>
                        </div>
                    </form>
                </div>
                <div class="layui-col-md2 isInpShow" style="display: none;">
                    <input type="text" name="newSuitType" required  lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input newSuitType">
                </div>
            </div>
        </div>
    </div>
    <div class="layui-row">
        <div class="layui-row hero-box-row">
            <div class="hero-box-3">
                <div class="hero-box-3-left"><img width="308" height="560" src="{$skinsBaseInfo.loadingImg}" id="skinsLoadingImg" alt="英雄页面主图" /></div>
                <div class="hero-box-3-right">
                    <p class="skin_title {if $skinsBaseInfo.loadingImgIsChange}blue{/if}">loading图<span class="title_pixel">308x560</span></p>
                    <div style="margin-top: 20px;" class="layui-row">
                        <div class="layui-col-md6">
                            <input type="text" name="loadingImg" required  lay-verify="required" placeholder="英雄皮肤loading图地址" autocomplete="off" class="layui-input skinsLoadingImg" value="{$skinsBaseInfo.loadingImg}">
                        </div>
                        <div class="layui-col-md6">
                            <button class="layui-btn" id="loading">浏览</button>
                            <button type="reset" class="layui-btn layui-btn-primary showLoadingImg" id="locdingImgAction">上传</button>
                        </div>
                    </div>
                </div>
            </div>
            <div class="hero-box-">
                <div class="hero-textarea">
                    <form class="layui-form layui-form-pane" action="">
                        <div class="layui-form-item layui-form-text">
                            <label class="layui-form-label">皮肤描述</label>
                            <div class="layui-input-block">
                                <textarea name="description" placeholder="请输入内容" id="heroDescription" class="layui-textarea heroDescription">{$skinsBaseInfo.description}</textarea>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="hero-box hero-box-1">
                    <div class="hero-box-1-left"><img width="60" height="60" src="{$skinsBaseInfo.iconImg}" id="skinsIconImg" alt="英雄头像主图" /></div>
                    <div class="hero-box-1-right">
                        <p class="skin_title {if $skinsBaseInfo.iconImgIsChange}blue{/if}">英雄页头像<span class="title_pixel">60x60</span></p>
                        <div style="margin-top: 20px;" class="layui-row">
                            <div class="layui-col-md6">
                                <input style="width: 500px;" type="text" name="iconImg" required  lay-verify="required" placeholder="英雄皮肤头像地址" autocomplete="off" class="layui-input skinsIconImg" value="{$skinsBaseInfo.iconImg}">
                            </div>
                            <div class="layui-col-md6">
                                <button class="layui-btn" id="icon">浏览</button>
                                <button type="reset" class="layui-btn layui-btn-primary showIconImg" id="iconImgAction">上传</button>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="hero-box hero-box-1">
                    <div class="hero-box-1-left"><img width="135" height="70" src="{$skinsBaseInfo.videoImg}" id="skinsVedioImg" alt="英雄封面主图" /></div>
                    <div class="hero-box-1-right">
                        <p class="skin_title {if $skinsBaseInfo.videoImgIsChange}blue{/if}">视频封面<span class="title_pixel">135x70</span></p>
                        <div style="margin-top: 20px;" class="layui-row">
                            <div class="layui-col-md6">
                                <input style="width: 430px;" type="text" name="videoImg" required  lay-verify="required" placeholder="视频封面皮肤图片地址" autocomplete="off" class="layui-input skinsVedioImg" value="{$skinsBaseInfo.videoImg}">
                            </div>
                            <div class="layui-col-md6">
                                <button class="layui-btn" id="video">浏览</button>
                                <button type="reset" class="layui-btn layui-btn-primary showVideoImg" id="vedioImgAction">上传</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="hero-box">
            <div class="hero-box-2">
                <div class="hero-box-2-left"><img width="985" height="500" src="{$skinsBaseInfo.mainImg}" id="skinsMainImg" alt="英雄页面主图" /></div>
                <div class="hero-box-2-right">
                    <p class="skin_title {if $skinsBaseInfo.mainImgIsChange}blue{/if}">英雄页主图<span class="title_pixel">985x500</span></p>
                    <div style="margin-top: 20px;" class="layui-row mainImg">
                        <div class="layui-col-md6">
                            <input type="text" name="mainImg" required  lay-verify="required"  placeholder="图片地址" autocomplete="off" class="layui-input skinsMainImg" value="{$skinsBaseInfo.mainImg}">
                        </div>
                        <div class="layui-col-md6">
                            <button class="layui-btn" id="main">浏览</button>
                            <button type="reset" class="layui-btn layui-btn-primary showMainImg" id="mainImgAction">上传</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="hero-box">
            <div class="hero-box-2">
                <div class="hero-box-2-left"><img width="1152" height="282" src="{$skinsBaseInfo.sourceImg}" id="skinsSourceImg" alt="英雄攻略中心大图" /></div>
                <div class="hero-box-2-right">
                    <p class="skin_title {if $skinsBaseInfo.sourceImgIsChange}blue{/if}">英雄攻略中心大图<span class="title_pixel">1920x470</span></p>
                    <div style="margin-top: 20px;" class="layui-row sourceImg">
                        <div class="layui-col-md6">
                            <input  style="width: 80%;" type="text" name="sourceImg" required  lay-verify="required"  placeholder="图片地址" autocomplete="off" class="layui-input skinsSourceImg" value="{$skinsBaseInfo.sourceImg}">
                        </div>
                        <div class="layui-col-md6">
                            <button class="layui-btn" id="source">浏览</button>
                            <button type="reset" class="layui-btn layui-btn-primary showSourceImg" id="sourceImgAction">上传</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div style="margin-top: 50px;margin-left: 40px;" class="layui-row">
        <div style="text-align: center;margin-bottom: 30px;" class="layui-col-md12">
            <span style=" display: inline-block;width: 44%;border-top: 1px solid #ccc;"></span>
            <span style="font-weight: bold;font-size: 20px;vertical-align: -7px;">炫彩</span>
            <span style=" display: inline-block;width: 44%;border-top: 1px solid #ccc;"></span>
        </div>
        <div class="layui-col-md12">
            {foreach $heroChromasInfo as $key=>$val}
            <div style="margin-bottom: 10px;" class="layui-col-md2">
                <img style="padding: 2%" width="270px" height="300px" src="{$val.loadingImg}" id="skinsColorfulImg{$val.skinId}" alt="{$val.name}">
                <p style="text-align: center;" class="{if $val.nameIsChange}blue{/if}">{$val.name}</p>
                <p style="text-align: center;">ID: {$val.skinId}</p>
                <input style="margin: 10px auto;width: 150px;" type="text" name="loadingImg" required  lay-verify="required" placeholder="图片地址" autocomplete="off" class="layui-input skinsColorfulImg{$val.skinId} {if $val.loadingImgIsChange}blue{/if}" value="{$val.loadingImg}">
                <div style="text-align: center;" class="layui-btn-container">
                    <button class="layui-btn colorful"  lay-data="{$val.skinId}">浏览</button>
                    <button type="reset" class="layui-btn layui-btn-primary showColorfulImg" id="colorfulImgAction{$val.skinId}">上传</button>
                </div>
            </div>
            {/foreach}
        </div>
    </div>
</div>
<script type="text/javascript" src="Public/Plug/layui/layui.all.js"></script>
<script type="text/javascript" src="Public/Plug/jquery/jquery-3.3.1.min.js"></script>
<script>
    layui.use(['layer','element','form','upload','laydate'], function() {
        var	$ = layui.jquery,
            element = layui.element,
            upload = layui.upload,
            form = layui.form,
            laydate = layui.laydate;

        var heroId = $("input:hidden[name='heroId']").val();
        var versionId = $("input:hidden[name='versionId']").val();
        var skinId = $("input:hidden[name='skinId']").val();

        //执行一个laydate实例
        laydate.render({
            elem: '#publishTime'
        });

        //展示英雄皮肤视频
        $(".showVideo").on("click",function () {
            var str = $(".skinVedioPath").val().replace(/(^\s*)|(\s*$)/g, "");
            if(str == ""){
                return layer.msg("请填写视频vid或完整地址");
            }else{
                var strType = str.substring(str.lastIndexOf(".")+1);
                //首先要判断是否是html
                if( strType != "html"  && strType!=""){
                    str = "https://v.qq.com/x/page/"+str+".html";
                }
                var URLRexExp = new RegExp(/^[A-Za-z]+:\/\/[A-Za-z0-9-_]+.[A-Za-z0-9-_%&\?\/.:=]+$/);
                if(!URLRexExp.test(str)){
                    layer.msg("获取视频URL地址无效");
                }else{
                    layer.open({
                        type: 2, //iframe层
                        title: false,
                        skin: 'layui-layer-rim', //加上边框
                        closeBtn: 1, //显示关闭按钮
                        shade: [0],
                        area: ['700px', '500px'], //宽高
                        content: [str, 'no'], //iframe的url，no代表不显示滚动条
                    });
                }
            }
        });

        //皮肤主图数据
         uploadMainImgIns = upload.render({
            elem: '#main'
            ,url: "{U('LolApi/uploadAllTypeImg')}"
            ,auto: false
            ,multiple: true
            ,size: 0
            ,accept: 'images'
            ,data: { heroId: heroId,versionId: versionId,skinId: skinId,table:'tbskins',key:'mainImg'}
            ,bindAction: '#mainImgAction'
            ,exts: 'jpg|png|gif|bmp|jpeg'
            ,choose: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#skinsMainImg').attr('src', result); //图片链接（base64）
                });
            }
            ,done: function(res){
                if(res.code === 0){
                    layer.msg(res.msg,{
                        icon: 1,//成功的表情
                        time: 1000
                    },function(){
                        $('.skinsMainImg').val(res.url);
                    });
                }else{
                    layer.msg(res.msg,{
                        icon: 2,//成功的表情
                        time: 1000
                    });
                }
            }
            ,error: function(index, upload){
                this.error(index, upload);
            }
        });

        //英雄皮肤头像数据
        uploadIconImgIns = upload.render({
            elem: '#icon'
            ,url: "{U('LolApi/uploadAllTypeImg')}"
            ,auto: false
            ,multiple: true
            ,size: 0
            ,accept: 'images',
            data: { heroId: heroId,versionId: versionId,skinId: skinId,table:'tbskins',key:'iconImg'}
            ,bindAction: '#iconImgAction'
            ,exts: 'jpg|png|gif|bmp|jpeg'
            ,choose: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#skinsIconImg').attr('src', result); //图片链接（base64）
                });
            }
            ,done: function(res){
                if(res.code === 0){
                    layer.msg(res.msg,{
                        icon: 1,//成功的表情
                        time: 1000
                    },function(){
                        $('.skinsIconImg').val(res.url);
                    });
                }else{
                    layer.msg(res.msg,{
                        icon: 2,//失败的表情
                        time: 1000
                    });
                }
            }
            ,error: function(index, upload){
                this.error(index, upload);
            }
        });

        //英雄皮肤loading图数据
        uploadLoadingImgIns = upload.render({
            elem: '#loading'
            ,url: "{U('LolApi/uploadAllTypeImg')}"
            ,auto: false
            ,multiple: true
            ,size: 0
            ,accept: 'images',
            data: { heroId: heroId,versionId: versionId,skinId: skinId,table:'tbskins',key:'loadingImg'}
            ,bindAction: '#locdingImgAction'
            ,exts: 'jpg|png|gif|bmp|jpeg'
            ,choose: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#skinsLoadingImg').attr('src', result); //图片链接（base64）
                });
            }
            ,done: function(res){
                if(res.code === 0){
                    layer.msg(res.msg,{
                        icon: 1,//成功的表情
                        time: 1000
                    },function(){
                        $('.skinsLoadingImg').val(res.url);
                    });
                }else{
                    layer.msg(res.msg,{
                        icon: 2,//成功的表情
                        time: 1000
                    });
                }
            }
            ,error: function(index, upload){
                this.error(index, upload);
            }
        });

        //英雄皮肤视频封面数据
        uploadVideoImgIns = upload.render({
            elem: '#video'
            ,url: "{U('LolApi/uploadAllTypeImg')}"
            ,auto: false
            ,multiple: true
            ,size: 0
            ,accept: 'images',
            data: { heroId: heroId,versionId: versionId,skinId: skinId,table:'tbskins',key:'videoImg'}
            ,bindAction: '#vedioImgAction'
            ,exts: 'jpg|png|gif|bmp|jpeg'
            ,choose: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#skinsVedioImg').attr('src', result); //图片链接（base64）
                });
            }
            ,done: function(res){
                if(res.code === 0){
                    layer.msg(res.msg,{
                        icon: 1,//成功的表情
                        time: 1000
                    },function(){
                        $('.skinsVedioImg').val(res.url);
                    });
                }else{
                    layer.msg(res.msg,{
                        icon: 2,//失败的表情
                        time: 1000
                    });
                }
            }
            ,error: function(index, upload){
                this.error(index, upload);
            }
        });

        //英雄原画大图数据
        uploadSourceImgIns = upload.render({
            elem: '#source'
            ,url: "{U('LolApi/uploadAllTypeImg')}"
            ,auto: false
            ,multiple: true
            ,size: 0
            ,accept: 'images',
            data: { heroId: heroId,versionId: versionId,skinId: skinId,table:'tbskins',key:'sourceImg'}
            ,bindAction: '#sourceImgAction'
            ,exts: 'jpg|png|gif|bmp|jpeg'
            ,choose: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#skinsSourceImg').attr('src', result); //图片链接（base64）
                });
            }
            ,done: function(res){
                if(res.code === 0){
                    layer.msg(res.msg,{
                        icon: 1,//成功的表情
                        time: 1000
                    },function(){
                        $('.skinsSourceImg').val(res.url);
                    });
                }else{
                    layer.msg(res.msg,{
                        icon: 2,//失败的表情
                        time: 1000
                    });
                }
            }
            ,error: function(index, upload){
                this.error(index, upload);
            }
        });

        //英雄炫彩皮肤数据
        $(".colorful").on("mousedown",function () {
            var skinId = $(this).attr("lay-data");
            //英雄炫彩皮肤数据
            uploadColorfulImgIns = upload.render({
                elem: '.colorful'
                ,url: "{U('LolApi/uploadAllTypeImg')}"
                ,auto: false
                ,multiple: true
                ,size: 0
                ,accept: 'images'
                ,data: { heroId: heroId,versionId: versionId,skinId: skinId,table:'tbskins',key:'loadingImg',color:true}
                ,bindAction: '#colorfulImgAction'+skinId
                ,exts: 'jpg|png|gif|bmp|jpeg'
                ,choose: function(obj){
                    //预读本地文件示例，不支持ie8
                    obj.preview(function(index, file, result){
                        $('#skinsColorfulImg'+skinId).attr('src', result); //图片链接（base64）
                    });
                }
                ,done: function(res){
                    if(res.code === 0){
                        layer.msg(res.msg,{
                            icon: 1,//成功的表情
                            time: 1000
                        },function(){
                            $('.skinsVedioImg').val(res.url);
                            location.reload();
                        });
                    }else{
                        layer.msg(res.msg,{
                            icon: 2,//失败的表情
                            time: 1000
                        });
                    }
                }
                ,error: function(index, upload){
                    this.error(index, upload);
                }
            });
        });

        //编辑皮肤数据
        $('.editSkin').click(function(){
            //皮肤视频处理
            var skinVedioPath = $(".skinVedioPath").val().replace(/(^\s*)|(\s*$)/g, "");
            var strType = skinVedioPath.substring(skinVedioPath.lastIndexOf(".")+1);
            //首先要判断是否是html
            if( strType != "html" && strType!=""){
                skinVedioPath = "https://v.qq.com/x/page/"+skinVedioPath+".html";
            }

            //数据收集
            var list = [];//创建数组
            var a1 = {};//创建对象
            a1.emblemsName = $('#skinType option:selected') .val();
            a1.suitType = $('#suitType option:selected').val();//英雄所属套装
            a1.newSuitType = $(".newSuitType").val();          //新增套装属性
            a1.skinsDescription = $(".heroDescription").val(); //英雄皮肤介绍
            a1.vedioPath = skinVedioPath;                   //英雄皮肤URL视频
            a1.skinsMainImgPath = $('.skinsMainImg').val(); //英雄皮肤主图URL
            a1.skinsIconImgPath = $('.skinsIconImg').val(); //英雄头像图URL
            a1.skinsLoadingImgPath = $('.skinsLoadingImg').val(); //英雄Loading图URL
            a1.skinsVedioImgPath = $('.skinsVedioImg').val(); //英雄视频封面URL
            a1.publishTime = $('.publishTime').val();         //英雄皮肤上架日期
            a1.heroId = $("input:hidden[name='heroId']").val();
            a1.versionId =  $("input:hidden[name='versionId']").val();
            a1.skinId = $("input:hidden[name='skinId']").val();
            //是否有炫彩皮肤
            {if count($heroChromasInfo) > 0}
            a1.skinsColor = 1;
            {else}
            a1.skinsColor = 0;
            {/if}
                //炫彩皮肤
                {foreach $heroChromasInfo as $key=>$val}
                a1.skinsColorfulImg{$val.skinId} = $('.skinsColorfulImg'+{$val.skinId}).val();
                {/foreach}
                    list.push(a1);//添加对象

                    var j = JSON.stringify(list);//将对象转换为json

                    var heroTitle = $("input:hidden[name='title']").val();

                    //提示信息
                    var str ="<div style='margin: 50px auto 0px;'>";
                    str+="<div style='padding: 0px 20px 0px 20px;'>确认保存当前英雄<span style='display: inline-block;color: red;'>"+heroTitle+"皮肤"+"</span>更改的数据吗？</div>";
                    str+="</div>";
                    layer.open({
                        type: 1,
                        title: '皮肤保存确认',
                        area: ['400px', '200px'] //自定义文本域宽高
                        ,content: str //这里content是一个普通的String
                        ,btn: ['确认', '取消']
                        ,yes: function(index, layero){
                            $(".layui-layer-btn0").hide();
                            //按钮【按钮一】的回调
                            var url =  "{U('Skin/eidtSkinInfo')}";
                            $.post(url,{ skinInfo: j},function(data){
                                if(data.status == 'error'){
                                    layer.msg(data.msg, {
                                        icon: 2,//失败的表情
                                        time: 1000 //2秒关闭（如果不配置，默认是3秒）
                                    }, function(){
                                        location.reload();
                                    });
                                }else if(data.status == 'success'){
                                    layer.msg(data.msg, {
                                        icon: 1,//成功的表情
                                        time: 1000 //2秒关闭（如果不配置，默认是3秒）
                                    }, function(){
                                        location.reload();
                                    });
                                }
                            })
                        }
                        ,btn2: function(index, layero){
                            //按钮【按钮二】的回调

                            //return false 开启该代码可禁止点击该按钮关闭
                        }
                    });
                });

        //检测更新
        $('.checkIsUpdate').click(function(){
            var url = "{U('Skin/setHeroSkinIsUpdate')}";
            $.ajax({
                url: url, type: "post", dataType: "json",
                beforeSend:function () {
                    layer.msg('任务创建成功，后台正在更新数据...预计10秒可以完成', {
                        icon: 1,//
                        time: 3000
                    });
                },
                success:function(data){
                    if(data.code === 0){
                        layer.msg(data.msg, {
                            icon: 1,//成功的表情
                            time: 1000 //2秒关闭（如果不配置，默认是3秒）
                        }, function(){
                            location.reload();
                        });
                    }else{
                        layer.msg(data.msg, {
                            icon: 2,//
                            time: 1000
                        });
                    }
                }
            });
        });
        //监听提交
        form.on('submit(formDemo)', function(data){
            layer.msg(JSON.stringify(data.field));
            return false;
        });

        // 展开
        $(".inp-check").click(function() {
            $(".sel-flag").toggle();
        });

        $(".inp-check-text").click(function() {
            $(".isInpShow").toggle();
        });
    });

    //更换英雄
    function changeData(heroId) {
        var url =  "{U('Hero/index')}";
        $.post(url,{ heroId: heroId},function(data){
            if(data.status == 'error'){
                layer.msg(data.msg);//失败的表情
                return;
            }else{
                layer.msg('切换成功', {
                    icon: 1,//成功的表情
                    time: 800 //1秒关闭（如果不配置，默认是3秒）
                }, function(){
                    location.reload();
                });
            }
        })
    }

    //更换皮肤
    function changeSkin(skinId) {

        var heroId = $("input:hidden[name='heroId']").val();
        var url =  "{U('Skin/index')}";
        $.post(url,{ skinId: skinId,heroId: heroId},function(data){
            if(data.status == 'error'){
                layer.msg(data.msg);//失败的表情
                return;
            }else{
                layer.msg('皮肤切换成功', {
                    icon: 1,//成功的表情
                    time: 600 //0.5秒关闭（如果不配置，默认是3秒）
                }, function(){
                    location.reload();
                });
            }
        })
    }
</script>
</body>

</html>